import React from 'react';
import { Carousel, message } from 'antd';
import {WeaErrorPage, WeaTools, WeaBrowser, WeaLocaleProvider} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;
import { isEqual, isEmpty } from 'lodash';
import { intervalMap } from '../../util/common';
import {WeaAddNotice} from 'weaPortalPublic';
import MarqueeCom from '../common/MarqueeCom';
//公告元素
class NewNoticeCom extends React.Component {
	constructor(props) {
		super(props);
		this.handleAddNotice = this.handleAddNotice.bind(this);
		this.onSubmitDoc = this.onSubmitDoc.bind(this);
	}
	handleAddNotice(state){
		this.refs.addNotice.onSetState(state);
	}
	onSubmitDoc(ids,names,datas){
		const { eid, handleRefresh } = this.props;
		WeaTools.callApi('/api/portal/noticeadd/addNotice', 'POST', { eid, docids: ids }).then(result=> {
			if(result.status == '2'){
				message.error(result.errormsg);
			}else{
				message.success("添加成功！");
				handleRefresh();
			}
		});
	}

	// componentDidMount(){
	// 	const { esetting } = this.props;
	// 	const {  perpage} = esetting;
	//
	// 	let height = document.getElementsByClassName("tabContant")[0].offsetHeight
	// 	let a = parseInt(height)+parseInt(perpage);
	// 	console.log(height,"===");
	//
	// 	console.log(a,"===");
	// 	// console.log(height);
	// 	 document.getElementsByClassName("tabContant")[0].style.height=a+"px";
	// }

	shouldComponentUpdate(nextProps, nextState){
		return !isEqual(this.state, nextState) || !isEqual(this.props, nextProps)
	}

	render() {
		const { eid, data, esetting, handleRefresh, scolltype, scrollSpeed } = this.props;
		const { canAddNotice, showContent, showImg, noticeNew,showTitle, createMethod, pageSize, multiPage, noticeIsText, eScrollDirection, linkmode, perpage: perpage_old } = esetting;
		let perpage = parseInt(pageSize);
		let __perpage = perpage;
		if(multiPage == '0') {
			perpage = parseInt(data.length)
			__perpage = perpage_old;
		};
		let __showImg = showImg;
		if(eScrollDirection.selected == '2'|| eScrollDirection.selected == '4') {
			__perpage = 1;
			__showImg = false;
		}
		let html = [];
		let repalceDatas = [];
		intervalMap(data.slice(0, perpage_old),(obj, i) => {
			let arr = [];
			for(var j = 0; j < __perpage; j++){
				const _num = __perpage - 1;
				let bool = "false";
				if(j==_num){
					bool = "true";
				}
				const n = i + j;
				const item = data.slice(0, perpage_old)[n];
				if (item) {
					repalceDatas.push({
						id: item.id,
						name: item.title
					});
					arr.push(<NoticeItem ecId={`${this && this.props && this.props.ecId || ''}_NoticeItem@dk0wgj@${i}`} handleClick={this.handleAddNotice} bool={bool} showImg={__showImg} showTitle={showTitle} showContent={showContent} createMethod={createMethod} item={item} linkmode={linkmode}/>);

					// if(!isEqual('2',eScrollDirection.selected) && (!isEqual('4',eScrollDirection.selected ))) {
					// 		arr.push(<div className='xian' style={{height:'1px',borderTop:'solid rgb(0,0,0,0.2) 1px'}}></div>);
					// 	}

				}
			}
			html.push(<div className={"portal-element-newnotice-com"}>{arr}</div>);
		}, perpage);
		let htmlMultiPage = <div/>
		if(multiPage == '0') htmlMultiPage = html; //不分页
		else htmlMultiPage = <Carousel ecId={`${this && this.props && this.props.ecId || ''}_Carousel@qy6ugr`} autoplay={html.length > 1} dots={html.length > 1}>{html}</Carousel>; // 分页
		// 纯文本
		if(noticeIsText == '1'&& data.length !== 0) {
			htmlMultiPage = <div className="portal-element-doc-content" id={`__content__${eid}`} dangerouslySetInnerHTML={{ __html: typeof(data[0].title)!=='undefined' ? data[0].title : ''  + '&nbsp' + typeof(data[0].content)!=='undefined' ? data[0].content :''}}></div>;
		}
		// 纯文本并且向左向右滚动
		if(eScrollDirection.selected &&noticeIsText == '1'&& data.length !== 0&& (eScrollDirection.selected == '2' || eScrollDirection.selected == '4')){
			htmlMultiPage = <div className="portal-element-doc-content" dangerouslySetInnerHTML={{ __html: typeof(data[0].title)!=='undefined' ? data[0].title : '' + '&nbsp' + typeof(data[0].content)!=='undefined' ? data[0].content :'' }}/>
		}

		return <div className="tabContant" id={`tabcontant_${eid}`} >
	<MarqueeCom ecId={`${this && this.props && this.props.ecId || ''}_MarqueeCom@b3980g`} tabdata={data} eid={eid} scolltype={scolltype} scrollSpeed={scrollSpeed} ebaseid={'notice'}>
			<div className="newnotice-add-Carousel">
			{html.length ? htmlMultiPage : ''}
			</div>
			</MarqueeCom>


			<WeaAddNotice ecId={`${this && this.props && this.props.ecId || ''}_WeaAddNotice@zpno2k`} ref="addNotice" eid={eid} handleRefresh={handleRefresh} canAddNotice={canAddNotice}/>
		{canAddNotice && noticeNew == '1' && createMethod == '2' ? <div className="noticeitemnew">

			<WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@gfmdg0`}
			type={'37'}
			title={getLabel(386382,"请选择")}
			icon='icon-coms-portal'
			iconBgcolor='#1a57a0'
			onChange={this.onSubmitDoc}
			customized
			memorise
			isSingle={false}
			replaceDatas={repalceDatas}
				>
				<div className="portal-element-newnotice-add">
			<img src="/page/element/newNotice/resource/image/new.png" title={getLabel(388030,"添加公告")} alt=""/>
			</div>
			</WeaBrowser>
			</div>: null}

			{canAddNotice  && createMethod == '1' ? <div className="noticeitemnew">
				<div className="portal-element-newnotice-add" onClick={this.handleAddNotice.bind(this,{isNew: true, visible: true, isView: false, id: '', title: '', imgsrc: '', content: '',})}>
				<img className="portal-element-newnotice-add-icon" src="/page/element/newNotice/resource/image/new.png" title={getLabel(388030,"添加公告")} alt=""/>
				</div>
				</div>: null}
				</div>
			}
		}
		import { openLinkUrl } from '../../util/common';
		class NoticeItem extends React.Component{
			constructor(props) {
				super(props);
				this.handleClick = this.handleClick.bind(this);
			}
			handleClick(){
				const { createMethod, item, handleClick, linkmode } = this.props;
				const { imgsrc, title, content, id, linkUrl } = item;

				if(createMethod == '1'){
					handleClick({ imgsrc, title, content, id, visible:true, isView: true});
				}else if(createMethod == '2' && linkUrl){
					openLinkUrl(linkUrl, linkmode);
				}
			}
			render(){
				const { showImg, showTitle, showContent, item, handleClick, bool} = this.props;
				let itemStyle = {

				}
				if(bool==="false"){
					itemStyle = {
						borderBottom:'1px solid rgb(176,224,230)',
					}
				}


				const { imgsrc, title, content, id } = item;
				let imgurl='';
				if(imgsrc==''){
					imgurl="/images/homepage/noimgdefault_wev8.jpg";
				}else{
					imgurl=imgsrc;
				}
				return <div className="portal-element-newnotice-item" style={{...itemStyle}} onClick={this.handleClick}>
					{showImg ? <div className="portal-element-newnotice-item-img">
					<img src={imgurl}  alt=""/>
					</div> : ''}
					<div className="portal-element-newnotice-item-content" style={{width: showImg ? 'calc(100% - 107px)' : '100%'}}>
			<div className="portal-element-newnotice-item-title">
					{showTitle ? title : ''}
					</div>
					<div className="portal-element-newnotice-item-summary" style={{WebkitBoxOrient: 'vertical'}}>
				{showContent ? (content.replace(/<[^>]+>/g,"")).replace(/&nbsp;/ig, "").replace(/&ldquo;/ig,'“').replace(/&rdquo;/ig,'”').replace(/&quot;/ig,'"').replace(/&lt;/g,'<').replace(/&gt;/g,'>').replace(/&mdash;/g,'—').replace(/&hellip;/g,'…') : ''}
			</div>
				</div>

				</div>
			}
			}

			class MyErrorHandler extends React.Component {
			render() {
				const hasErrorMsg = this.props.error && this.props.error !== "";
				return (
					<WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@k1iu3n`} msg={hasErrorMsg?this.props.error:getLabel(385218,"对不起，该页面异常，请联系管理员！")} />
			);
			}
		}
		NewNoticeCom = WeaTools.tryCatch(React, MyErrorHandler, { error: "" })(NewNoticeCom);
		export default NewNoticeCom;
